<template>
	<view class="Recharge_content Transfer_content">
		<view class="kuang">
			<view class="title">
				<image src="../../static/image/left.png" mode="" @tap="back"></image>
				<text>{{i18n.Collection}}</text>
			</view>
			<view class="choice">
			<!-- 	<input type="text"  placeholder=""/> -->
				<view class="example-body" style="width: 100%;">
					<uni-combox :label="i18n.selectToken" :candidates="candidates" placeholder="" v-model="coin" @input="getCoin"></uni-combox>
				</view>
			</view>
			
			<view class="balance transfer">
				<view class="balancetitle">
					<image src="../../static/image/OEXCOM.png" mode=""></image>
				</view>
				<view class="balancetext">
					<image src="../../static/image/map.png" mode="" class="map"></image>
					
						<view  class="amount_num">
								<input type="digit" style="width: 100%;" :placeholder="i18n.Amount" placeholder-style="color:#fff;font-size:33upx;font-weight:normal" @input="getAmount"/>
								
						</view>
					</view>
					<view class="hx">
					</view>
					<view class="amount">
						<text>{{i18n.Token}}:{{coin_Name}}</text>
					</view>
					<!-- <view  class="amount_num">
							<text>{{coin_Name}}</text>
					</view> -->
					
					<!-- <view class="imgbox">
						<canvas class="canvas" canvas-id="qrcode" style="width: 294upx;height: 294upx;" />
					</view> -->
					
				</view>
			
				<view class="imgbox">
					<canvas class="canvas" canvas-id="qrcode" style="width: 200px;height: 200px;" />
				</view>
			</view>
			
			<view class="bottombutton" @tap="makeQrcodeImg" :class="isSave?'bottom':''">
				{{i18n.QR}}
			</view>
			<view class="bottombutton" @tap="saveQrcode" v-if="isSave">
				{{i18n.savePHOTO}}
			</view>
		</view>


	</view>
</template>

<script>
	import uniCombox from "../../components/uni-combox/uni-combox"
	import * as oex from 'oex-web3'; 
	import {myMixins} from '../../common/mixins.js'
	import uQRCode from '../../common/uqrcode.js'
	export default {
		computed: {
			i18n() {
				return this.$t('user')
			}
		},
		mixins: [myMixins], // 使用mixin
		data() {
			return {
				amount:0,
				isSave:false,
				//币种选择
				candidates: [],
				copyCandidates:[],
				symablList:[],
				coin: '',
				coin_Name:"",
				coin_name:this._i18n.locale == 'zh_CN' ? "请选择币种":'Please select currency',//显示的币种名称
				
				//个人账户信息
				accountName:"",
				accountID:"",
				assetinfolist:"",//获取当前主流资产列表
				
				qrcodeSrc:"",
				canvasShow:true
			}
		},
		watch:{
			coin(val){
				
			}
		},
		components: {uniCombox},
		onLoad() {
			//	获取当前主流资产列表
			this.getAssetinfolist();
		},
		methods: {
			
			async getAssetinfolist(){
				//	获取当前主流资产列表
				const _this = this;
				uni.request({
					url:this.$API.appServeApi + this.$API.assetinfolist + '?i18n_language=' + uni.getStorageSync('system_info'),
					success(res) {
						//console.log(res)
						if(res.data.code == 200){
							
							if(res.data.data.length > 0){
								res.data.data.map(item =>{
									_this.request(item.assetname);
								})
							}
						}else{
							_this.showToast(res.data.message)
						}
					}
				})
			},
			async request(assetname,search){
				const _this = this;
				
				//oex.utils.setApp();
				var data = await  oex.account.getAssetInfoByName(assetname); //请求参数
				const nodeInfo = uni.getStorageSync('nodeInfo');
				
				this.$CommonJS.request(nodeInfo,"POST",data).then( res => {
						console.log(res)
						if(res.data.result){
							const  d = res.data.result;
							const str = d.assetName + '  ' +'(' + d.symbol.toUpperCase() + ')';
							
							_this.candidates = _this.candidates.filter(item =>{
								return item != str
							})
							
							
							_this.symablList.unshift(d)
							_this.candidates.unshift(d.assetName + '  ' +'(' + d.symbol.toUpperCase() + ')');
							_this.copyCandidates.unshift(d.assetName + '  ' +'(' + d.symbol.toUpperCase() + ')');
						}
					
				}).catch(error => {
						console.log(error)
				})
			},
			async getAccountExByName(){
				const _this = this;
				const accountName =  account.getAccount().then(res =>{
					_this.accountName = res.data.result.accountName;
					_this.accountID = res.data.result.accountID;
				}).catch(error =>{
					console.log(error)
				})
			},
			back(){
				//返回
				this.$CommonJS.navigateBack()
			},
			getAmount(event){
				//输入收款数量
				this.amount = event.target.value;
				
			},
			async makeQrcodeImg(){
				//制作二维码
			 	let _this = this;
				
				if(this.coin_name == "请选择币种" || this.coin_name == 'Please select currency'){
					_this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? "请选择币种":'Please select currency');
					return;
				}
				if(this.amount == 0 ||this.amount == this.$t('user.Amount')){
					_this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '数量不能为空':'Quantity cannot be empty');
					return;
				}
				
				let str = this.coin_name;
				if(this.coin_name.indexOf('(') == -1){
					 str = this.coin_Name.trim();
				}else{
					str = this.coin_Name.split('(')[0].trim();
				}
				
				oex.utils.setApp();
				var data = await  oex.account.getAssetInfoByName(str); //请求参数
				const nodeInfo = uni.getStorageSync('nodeInfo');
				
				this.$CommonJS.request(nodeInfo,"POST",data).then( res => {
					console.log(res)
					if(!res.data.result){
						_this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '无此资产':'There is no such asset');
						return;
					}else{
						//二维码传递数据
						console.log(this.amount);
						const str = JSON.stringify({
							ToaccountName:this.account_info.accountName,
							ToaccountID:this.account_info.accountID,
							Tocoin_name:this.coin_name,
							Toamount:this.amount,
							assetId:res.data.result.assetId,
						 decimals:res.data.result.decimals,
							symbol:res.data.result.symbol
						})
						console.log(str)
						
						uQRCode.make({
							canvasId: 'qrcode',
							componentInstance: this,
							text: str,
							size: 200,
							margin: 10,
							backgroundColor: '#ffffff',
							foregroundColor: '#000000',
							fileType: 'jpg',
							correctLevel: uQRCode.errorCorrectLevel.H,
							success: res => {
								this.isSave = true;
								this.qrcodeSrc = res;
							}
						})
					}
				}).catch(err =>{
					console.log(err)
				})
				
				
			},
			saveQrcode() {
				//保存二维码
				const _this = this;
				uni.saveImageToPhotosAlbum({
						filePath: this.qrcodeSrc,
						success: function () {
							uni.showToast({
								title:_this._i18n.locale == 'zh_CN' ? '已保存':'Saved',
							})
						}
				});
			},
			getCoin(e){
				if(this.candidates.length > 0){
					this.candidates.map(item =>{
						if(item.indexOf(e) == -1){
							this.request(e)
						}
					})
				}else{
					this.request(e)
				}
				
				this.coin_name = e;
				this.coin_Name = e;
			}
		}
	}
</script>

<style lang="stylus">
	@import "../../static/stylus/recharge/transfer.stylus"
</style>